<style>
    febs-user-common  .eleTree-node-content-label{
        cursor: pointer;
    }
</style>
<div class="febs-container" id="febs-user-common" >
    <div class="febs-component-body" lay-title="用户选择">
        <div class="layui-row layui-col-space8 febs-full" style="margin: 0px -4px;">
            <div class="layui-col-md3 layui-col-sm3 layui-col-xs6 febs-full" id="deptTreeContainer" style="padding: 0 4px;">
                <div class="layui-card febs-full" style="overflow-y: auto;">
                    <div class="layui-card-body febs-table-full">
                        <div class="tree-container">
                            <div class="eleTree deptTreeCommon" lay-filter="deptTreeCommon" style="margin-left: 1rem"></div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-col-md9 layui-col-sm9 layui-col-xs12 febs-full" id="userTableContainer" style="padding: 0 4px;">
                <div class="layui-card febs-full">
                    <div class="layui-card-body">
                        <form class="layui-form layui-table-form" lay-filter="user-table-common-form">
                            <div class="layui-form-item">
                                <div class="layui-inline">
                                    <label class="layui-form-label layui-form-label-sm" style="width: auto !important;">员工工号</label>
                                    <div class="layui-input-inline">
                                        <input type="text" name="userNo" autocomplete="off" class="layui-input">
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label layui-form-label-sm" style="width: auto !important;">员工账户</label>
                                    <div class="layui-input-inline">
                                        <input type="text" name="userName" autocomplete="off" class="layui-input">
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label layui-form-label-sm" style="width: auto !important;">员工姓名</label>
                                    <div class="layui-input-inline">
                                        <input type="text" name="uname" autocomplete="off" class="layui-input">
                                    </div>
                                </div>

                                <div class="layui-inline">
                                    <label class="layui-form-label layui-form-label-sm" style="width: auto !important;">联系方式</label>
                                    <div class="layui-input-inline">
                                        <input type="text" name="mobile" autocomplete="off" class="layui-input">
                                    </div>
                                </div>

                                <div class="layui-inline">
                                    <div id="query" class="layui-btn">
                                        <i class="layui-icon">&#xe615;</i> 查询
                                    </div>
                                </div>
                            </div>
                        </form>
                        <div >
                            <table lay-filter="userTableCommon" lay-data="{id: 'userTable'}"></table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script data-th-inline="none" type="text/javascript">
    layui.use(['dropdown', 'jquery', 'laydate', 'eleTree', 'commonJS', 'form', 'table', 'febs'], function () {
        var $ = layui.jquery,
            febs = layui.febs,
            form = layui.form,
            commonJS = layui.commonJS,
            table = layui.table,
            eleTree = layui.eleTree,
            $view = $('#febs-user-common'),
            $query = $view.find('#query'),
            $searchForm = $view.find('form'),
            tableIns;

        let tenantId = POPUP_DATA.tenantId
        let deptId = POPUP_DATA.deptId
        let multiple = POPUP_DATA.multiple
        let selectList = POPUP_DATA.selectList
        form.render();

        if(commonJS.isEmpty(deptId)){
            renderMenuTree();
        }else{
            $view.find("#deptTreeContainer").hide()
            $view.find("#userTableContainer").css("width","100%");
        }

        initTable();
        autoHeight()

        function initTable() {
            tableIns = febs.table.init({
                elem: $view.find('table'),
                id: 'userTableCommon',
                url: ctx + 'common/user/page',
                skin: '',
                where:getQueryParams(),
                cols: [[
                    {type: multiple?'checkbox': 'radio'},
                    {field: 'userNo', title: '用户工号', width: 160,align:'center'},
                    {field: 'uname', title: '用户姓名', minWidth: 140},
                    {field: 'deptName', title: '所属部门', width: 140},
                    {field: 'postName', title: '所属岗位', width: 140},
                    {field: 'mobile', title: '联系方式', width: 140,align:'center'},
                    {field: 'email', title: '联系邮箱', minWidth: 160}
                ]]
            });
        }

        window.getSelectData = function(){
            let selData= table.checkStatus("userTable")
            let returnData
            if(selData.data.length>0){
                if(!commonDto.multiple){
                    returnData=selData.data[0]
                }else{
                    returnData=selData.data
                }
            }
            return returnData
        }

        $query.on('click', function () {
            tableIns.reload({where: getQueryParams(), page: {curr: 1}});
        });

        function renderMenuTree() {
            eleTree.render({
                elem: '.deptTreeCommon',
                url: ctx + 'common/dept/tree',
                where: {
                    "invalidate_ie_cache": new Date(),
                    deptId: deptId,
                    status:'1',
                    tenantId:tenantId
                },
                accordion: false,
                highlightCurrent: true,
                renderAfterExpand: false,
                expandOnClickNode: false,
                checkOnClickNode: true,
                spread: true,
                defaultExpandAll:true,
                request: {
                    name: 'name',
                    key: "id",
                    checked: "checked",
                    data: 'data'
                },
                response: {
                    statusName: "code",
                    statusCode: 200,
                    dataName: "data"
                },
                done: function (data) {

                }
            });
        }

        eleTree.on("nodeClick(deptTreeCommon)", function (d) {
            var data = d.data.currentData.data;
            if (data.deptId != undefined) {
                deptId = data.deptId
                $query.click();
            }
        });

        function getQueryParams() {
            return {
                tenantId:tenantId,
                userNo:$searchForm.find('input[name="userNo"]').val()?.trim(),
                userName: $searchForm.find('input[name="userName"]').val()?.trim(),
                uname: $searchForm.find('input[name="uname"]').val()?.trim(),
                mobile: $searchForm.find("input[name='mobile']").val()?.trim(),
                deptId: deptId,
                userType: POPUP_DATA.userType,
                status:'1',
                invalidate_ie_cache: new Date()
            };
        }

        function autoHeight() {
            $view.find('.layui-card').height("100%");
        }

        $(window).resize(function () {
            autoHeight();
        });

        window.getSelectData = function(){
            let selData= table.checkStatus("userTableCommon")
            let returnData
            if(selData.data.length>0){
                if(!multiple){
                    returnData = {
                        tenantId:selData.data[0].tenantId,
                        userId:selData.data[0].userId,
                        userNo:selData.data[0].userNo,
                        userName:selData.data[0].userName,
                        sex:selData.data[0].sex,
                        deptId:selData.data[0].deptId,
                        deptName:selData.data[0].deptName,
                        uname:selData.data[0].uname,
                        identificationNo:selData.data[0].identificationNo,
                        telephone:selData.data[0].telephone,
                        mobile:selData.data[0].mobile,
                        email:selData.data[0].email,
                        userType:selData.data[0].userType,
                        postId:selData.data[0].postId,
                        postName:selData.data[0].postName,
                        contractorId:selData.data[0].contractorId,
                        contractorName:selData.data[0].contractorName,
                        contractorTeamId:selData.data[0].contractorTeamId,
                        contractorTeamName:selData.data[0].contractorTeamName,
                        seniority:selData.data[0].seniority,
                        literacy:selData.data[0].literacy,
                        totalScore: selData.data[0].totalScore,
                        joinDate: selData.data[0].joinDate,
                    }
                    if(null != selectList && valueExists(selectList,"userId",returnData.userId)){
                        returnData = null
                    }
                }else{
                    returnData = []
                    $.each(selData.data,function(index,item){
                        let userItem = null
                        userItem = {
                            tenantId:item.tenantId,
                            userId:item.userId,
                            userNo:item.userNo,
                            userName:item.userName,
                            sex:item.sex,
                            deptId:item.deptId,
                            deptName:item.deptName,
                            uname:item.uname,
                            identificationNo:item.identificationNo,
                            telephone:item.telephone,
                            mobile:item.mobile,
                            email:item.email,
                            userType:item.userType,
                            postId:item.postId,
                            postName:item.postName,
                            contractorId:item.contractorId,
                            contractorName:item.contractorName,
                            contractorTeamId:item.contractorTeamId,
                            contractorTeamName:item.contractorTeamName,
                            seniority:item.seniority,
                            literacy:item.literacy,
                            totalScore: item.totalScore,
                            joinDate: item.joinDate,
                        }
                        if(null != selectList && valueExists(selectList,"userId",item.userId)){
                            userItem = null
                        }
                        if(null != userItem){
                            returnData.push(userItem)
                        }
                    })
                }
            }
            return returnData
        }

        function valueExists (arrayList,fieldName,value){
           let result = $.grep(arrayList,function (e){
                return e[fieldName] == value;
            })
            return result && result.length > 0;
        }
    })
</script>